import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:pornhub_app/assets/styles.dart';
import 'package:pornhub_app/model/blogger/blogger_video_collection.dart';
import 'package:pornhub_app/routes/routes.dart';
import 'package:pornhub_app/utils/extension.dart';

import '../../utils/color.dart';
import '../image_view.dart';

class CollectionCell extends StatelessWidget {
  final BloggerVideoCollectionModel model;
  final int index;
  const CollectionCell({super.key, required this.model, required this.index});

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Stack(
          children: [
            Container(
              width: 114.w,
              height: 114.w,
              decoration:
                  BoxDecoration(borderRadius: BorderRadius.circular(8.w)),
              child: ImageView(
                src: model.coverImg,
                width: 114.w,
                height: 114.w,
                borderRadius: BorderRadius.circular(6.w),
              ),
            ),
            Positioned(
                bottom: 4,
                left: 0,
                right: 0,
                child: Container(
                  padding: EdgeInsets.only(left: 4.w, bottom: 4.w),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      // Text(
                      //   "0.40km",
                      //   style: kTextStyle(COLOR.white, fontsize: 10.w),
                      // ),
                      Text(
                        "${model.videoNum}",
                        maxLines: 1,
                        overflow: TextOverflow.ellipsis,
                        style: kTextStyle(COLOR.white, fontsize: 12.w),
                      ),
                    ],
                  ),
                ))
          ],
        ),
        Text("${model.collectionName}",
                style: kTextStyle(COLOR.white, fontsize: 12.w))
            .marginTop(6.w)
      ],
    ).onOpaqueTap(() {
      Get.toBloggerCollectionDetail(model.collectionId);
    });
  }
}
